import React from "react";
import { connect } from "react-redux";
import { messages } from "share/common";
import { Button, Col, Radio, Row } from "antd";
class DepartmentConfig extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      loading: false,
      departmentConfig: {},
    };
  }

  componentWillReceiveProps(nextProps) {
    let { departmentConfig } = this.props.params;
    this.setState({
      departmentConfig,
    });
  }
  onRadioGroupChange = (event) => {
    let { departmentConfig } = this.state;
    let target = event.target;
    if (target) {
      let { name, value } = target;
      departmentConfig[name] = value;
      this.setState({
        departmentConfig,
      });
    }
  };
  onOk = () => {
    let { departmentConfig } = this.state;
    this.setState({
      loading: true,
    });
    this.props.onOk(
      departmentConfig,
      () => {
        this.setState({
          loading: false,
        });
        this.props.close();
      },
      () => {
        this.setState({
          loading: false,
        });
      }
    );
  };

  onCancel = () => {
    let { onDepartmentConfigCancel } = this.props.params;
    onDepartmentConfigCancel();
    this.props.close();
  };

  render() {
    let { departmentConfig, loading } = this.state;
    return (
      <div>
        <Row>
          <Col span={6}>{messages("basic-5.key344") /*部门关联公司*/}</Col>
          <Col span={17}>
            <Radio.Group
              name={"companyControlStatus"}
              value={departmentConfig.companyControlStatus}
              onChange={this.onRadioGroupChange}
            >
              <Radio value={"OPEN"}>{messages("basic-5.key345") /*关联*/}</Radio>
              <Radio value={"CLOSE"}>{messages("basic-5.key346") /*不关联*/}</Radio>
            </Radio.Group>
            <div className={"standard-note-text inline-gap"}>
              {messages("basic-5.key347") /* 1.启用后支持部门关联公司管控，一个部门只能属于一个公司，且不支持修改。*/}
            </div>
            <div className={"standard-note-text bottom-gap"}>
              {messages("basic-5.key348") /* 2. 当开关启用后，人上的部门和公司须与部门上的公司一致 */}
            </div>
          </Col>
        </Row>
        <Row className="inline-gap">
          <Col span={6}>{messages("basic-5.key349") /*只能选择叶子部门*/}</Col>
          <Col span={17}>
            <Radio.Group
              name={"leafSelectionRequired"}
              value={departmentConfig.leafSelectionRequired}
              onChange={this.onRadioGroupChange}
            >
              <Radio value={"true"}>{messages("common.yes") /*是*/}</Radio>
              <Radio value={"false"}>{messages("common.no") /*否*/}</Radio>
            </Radio.Group>
            <div className={"standard-note-text inline-gap"}>
              {messages("basic-5.key350") /*该设置用来决定选择部门时，是否只能选择子部门。*/}
            </div>
          </Col>
        </Row>
        <Row className="inline-gap">
          <Col span={6}>{messages("basic-5.key351") /*部门经理必填*/}</Col>
          <Col span={17}>
            <Radio.Group
              name={"managerRequired"}
              value={departmentConfig.managerRequired}
              onChange={this.onRadioGroupChange}
            >
              <Radio value={"true"}>{messages("basic-5.key352") /*必填*/}</Radio>
              <Radio value={"false"}>{messages("basic-5.key353") /*非必填*/}</Radio>
            </Radio.Group>
            <div className={"standard-note-text inline-gap"}>
              {messages("basic-5.key354") /*该设置用来决定编辑部门时，是否必填部门经理字段。*/}
            </div>
          </Col>
        </Row>
        <Row>
          <Col span={6}>{messages("basic-5.key355") /*部门全路径显示*/}</Col>
          <Col span={17}>
            <Radio.Group
              name={"fullPathDisabled"}
              value={departmentConfig.fullPathDisabled}
              onChange={this.onRadioGroupChange}
            >
              <Radio value={"false"}>{messages("common.yes") /*是*/}</Radio>
              <Radio value={"true"}>{messages("common.no") /*否*/}</Radio>
            </Radio.Group>
            <div className={"standard-note-text inline-gap"}>
              {messages("basic-5.key356") /*该设置用来决定部门路径是否全路径显示。*/}
            </div>
          </Col>
        </Row>
        <div className="slide-footer">
          <Button type="primary" onClick={this.onOk} loading={loading}>
            {messages("common.save") /*保存*/}
          </Button>
          <Button onClick={this.onCancel}>{messages("common.cancel") /*取消*/}</Button>
        </div>
      </div>
    );
  }
}
DepartmentConfig.propTypes = {};
DepartmentConfig.defaultProps = {};

function mapStateToProps(state) {
  return {};
}

DepartmentConfig.contextTypes = {
  router: React.PropTypes.object,
};
export default connect(mapStateToProps)(DepartmentConfig);
